<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>体验金</title>
    <link rel="stylesheet" type="text/css" href="./css/api.css" />
    <link rel="stylesheet" type="text/css" href="./css/aui.css" />
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <script type="text/javascript" src="./script/api.js"></script>
    <script type="text/javascript" src="./script/aui-tab.js" ></script>
    <link rel="stylesheet" type="text/css" href="./css/aui-slide.css" />
    <script type="text/javascript" src="./script/aui-slide.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/jquery-3.2.0.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript">
        function closeWin(){
            // 注册成功后的逻辑
            var gotoUser = 'gotoUser();';
            api.execScript({
                name: 'home',
                script: gotoUser,
            });
            api.closeToWin({
                name: 'home'
            });
        };
    </script>
</head>
<body>
 <!-- 头部 -->
 <header class="aui-bar aui-bar-nav pos">
    <a class="aui-pull-left aui-btn" onclick="closeWin()">
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <div class="aui-title">体验金</div>
</header>
<div class="header-d"></div>
<div id="list">
    <div class="money-1">
        <ul class="aui-row">
            <li class="aui-col-xs-3">
                体验金余额
                <p>-</p>
                <span>(元)</span>
            </li>
            <li class="aui-col-xs-3">
                已领取收益
                <p>-</p>
                <span>(元)</span>
            </li>
            <li class="aui-col-xs-3">
                待领取收益
                <p>-</p>
                <span>(元)</span>
            </li>
            <li class="aui-col-xs-3">
                预计收益
                <p>-</p>
                <span>(元)</span>
            </li>
        </ul>
        <a>领取收益</a>
    </div>
    <div class="money-2">
        <h3>金企贷</h3>
        <ul class="aui-row">
            <li class="aui-col-xs-3">-</li>
            <li class="aui-col-xs-3">-</li>
            <li class="aui-col-xs-3">-</li>
            <li class="aui-col-xs-3"><a>投资</a></li>
        </ul>
    </div>

    <div class="money-3">
        <div class="aui-tab" id="tab">
            <div class="aui-tab-item aui-active" data-item-order="0">获取记录</div>
            <div class="aui-tab-item" data-item-order="1">投资记录</div>
        </div>
        <div class="money-3-d">
            <div class="money-3-d-item">
                <table cellpadding="0" cellspacing="0">
                    <tr>
                        <th width="35%">时间</th>
                        <th width="35%">金额</th>
                        <th width="30%">状态</th>
                    </tr>
                    <tr>
                        <td>-</td>
                        <td>-</td>
                        <td>-</td>
                    </tr>
                </table>
            </div>
            <div class="money-3-d-item">
                <ul>
                    <li>
                        <h3>金车贷 -</h3>
                        <p>投资时间：<span>-</span></p>
                        <p>期限：<span>-</span></p>
                        <p>投资金额：<span>-</span></p>
                        <p>年化收益率：<span>-</span></p>
                        <p>预期收益：<span>-</span></p>
                        <p>状态：<span>-</span></p>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

</body>
<script type="text/template" id="template">
    <div class="money-1">
        <ul class="aui-row">
            <li class="aui-col-xs-3">
                体验金余额
                <p>{{=it.learn_balance}}</p>
                <span>(元)</span>
            </li>
            <li class="aui-col-xs-3">
                已领取收益
                <p>{{=it.has_lead_interest}}</p>
                <span>(元)</span>
            </li>
            <li class="aui-col-xs-3">
                待领取收益
                <p>{{=it.no_lead_interest}}</p>
                <span>(元)</span>
            </li>
            <li class="aui-col-xs-3">
                预计收益
                <p>{{=it.uc_interest}}</p>
                <span>(元)</span>
            </li>
        </ul>
        <a onclick="get_learn();">领取收益</a>
    </div>
    <div class="money-2">
        <h3>金企贷</h3>
        <ul class="aui-row">
            <li class="aui-col-xs-3">{{=it.learn_info.load_money}}</li>
            <li class="aui-col-xs-3">{{=it.learn_info.rate}}%</li>
            <li class="aui-col-xs-3">{{=it.learn_info.time_limit}}天</li>
            <li class="aui-col-xs-3"><a onclick="invest()">投资</a></li>
        </ul>
    </div>

    <div class="money-3">
        <div class="aui-tab" id="tab">
            <div class="aui-tab-item aui-active" data-item-order="0">获取记录</div>
            <div class="aui-tab-item" data-item-order="1">投资记录</div>
        </div>
        <div class="money-3-d">
            <div class="money-3-d-item">
                <table cellpadding="0" cellspacing="0">
                    <tr>
                        <th width="35%">时间</th>
                        <th width="35%">金额</th>
                        <th width="30%">状态</th>
                    </tr>
                    {{? it.learn_send_list}}
                    {{~it.learn_send_list:value:index}}
                    <tr id="get_record">
                        <td>{{=value.begin_time}}</td>
                        <td>{{=value.money}}</td>
                        {{? value.is_use == 1}}
                        <td>已投资</td>
                        {{??}}
                        <td>未投资</td>
                        {{?}}
                    </tr>
                    {{~}}
                    {{??}}
                    <tr>
                        <td colspan="3" class="money-3-d-n">没有获取记录</td>
                    </tr>
                    {{?}}
                </table>
            </div>
            <div class="money-3-d-item">
                <ul id="loan_record">
                    {{? it.learn_load_list}}
                    {{~it.learn_load_list:value:index}}
                    <li>
                        <h3>{{=value.name}}</h3>
                        <p>投资时间：<span>{{=value.create_date}}</span></p>
                        <p>期限：<span>{{=value.time_limit}}天</span></p>
                        <p>投资金额：<span>￥{{=value.money}}</span></p>
                        <p>年化收益率：<span>{{=value.rate}}%</span></p>
                        <p>预期收益：<span>￥{{=value.interest}}</span></p>
                        <p>状态：<span>{{=value.state}}</span></p>
                    </li>
                    {{~}}
                    {{??}}
                    <div class="money-3-d-n">没有投资记录</div>
                    {{?}}
                </ul>
            </div>
        </div>
    </div>
</script>
<script type="text/javascript">

    apiready = function(){
        api.addEventListener({
            name: 'keyback'
        }, function(ret, err) {
            closeWin();
        });
        updateData();
    }

    // 加载数据
    function updateData(){
        // 进度提示框
        api.showProgress({
            title: '努力加载中...',
            text: '请稍等...',
            modal: false
        });
        var userid = $api.getStorage('userid');
        api.ajax({
            url: webAddress + '/index.php?ctl=uc_learn&act=learn',
            method: 'post',
            data: {
                values: {
                 userid: userid,
             },
         }
     },function(ret, err){
        if (ret) {
            // 关闭下拉刷新控件
            // api.refreshHeaderLoadDone();
            api.hideProgress();
            if (ret.status == 0) {
                alert(ret.info);
                return false;
            }else{

                var data = ret;
                learn_info = ret;
                no_lead_interest = ret.no_lead_interest;
                templateFun(data);

            }
        } else {
            alert(err.msg);
            // 关闭下拉刷新控件
            api.refreshHeaderLoadDone();
            // 关闭加载状态控件
            api.hideProgress();
        }
    });
    }

    // 模板赋值函数
    function templateFun(data){

      var template = $api.byId('template');
      var dotFn = doT.template(template.innerHTML);
      var html = dotFn(data);
      var user = $api.byId('list');
      $api.html(user, html);

      $('.aui-tab-item').on("click",function(){
        var index1 = $(this).index();
        $(this).addClass('aui-active').siblings().removeClass('aui-active');

        $('.money-3-d .money-3-d-item').eq(index1).show().siblings().hide()
    });
  }

    // 投资按钮
    function invest(){
        var delay = 0;
        if (api.systemType != 'ios') {
            // delay = 300;
        }
        api.openWin({
            name: 'licai-zhitou-2',
            url: './licai-zhitou-2.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            },
            pageParam: {
                learn_info: learn_info
            }
        });
    }

    function get_learn(){
        if (no_lead_interest == 0) {
            api.toast({
                msg: '无可领取收益',
                duration: 2000,
                location: 'middle'
            });
        }else{
            // 进度提示框
            api.showProgress({
                title: '努力加载中...',
                text: '请稍等...',
                modal: false
            });
            var userid = $api.getStorage('userid');
            api.ajax({
                url: webAddress + '/index.php?ctl=uc_learn&act=do_interest',
                method: 'post',
                data: {
                    values: {
                     userid: userid,
                 },
             }
         },function(ret, err){
            if (ret) {
                api.hideProgress();
            } else {
                // 关闭加载状态控件
                api.hideProgress();
                api.toast({
                    msg: '领取成功',
                    duration: 2000,
                    location: 'middle'
                });
                updateData();
            // alert(err.msg);
            // 关闭下拉刷新控件
            // api.refreshHeaderLoadDone();
        }
    });
        }
    }

</script>
</html>